<template>
  <div id="app">
    <input type="text" :value="msg" />
    <hr />
    <input type="text" v-bind:value="msg" />
    <input type="file" id="file" />
    <a :href="url">我是百度</a><br />
    <a :href="url1">我是谷歌</a>
    <br />
    <input type="checkbox" :checked="flag" />
    <div>{{ age1 | add }}</div>
    <button @click="addfn">点击我加5</button>
    <div>{{ age }}</div>
    <img :src="imgurl" alt="" id="img" />
    <img :src="img" alt="" />
  </div>
</template>

<script>
export default {
  data() {
    return {
      msg: '我是杭州黑马最帅的人',
      url: 'http://www.baidu.com',
      url1: 'http://www.taobao.com',
      age: 'hellow',
      flag: true,
      age1: 18,
      imgurl:
        'https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fc-ssl.duitang.com%2Fuploads%2Fblog%2F202109%2F06%2F20210906225922_1c31b.thumb.1000_0.jpeg&refer=http%3A%2F%2Fc-ssl.duitang.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1674720471&t=fc4cb4cc5756dfa805fff9614ba1abf2',

      img: 'https://tse1-mm.cn.bing.net/th/id/OIP-C.ZcjidB6ytMyNAjg9clT4PAHaNK?pid=ImgDet&rs=1',
    }
  },
  methods: {
    addfn() {
      this.age1 += 5
    },
  },
}
//   filters:(
//     subadd:(item) => return item-10
// ),}
</script>

<style scoped>
img {
  width: 400px;
}
</style>
